<template>
  <div class='lg-body pa'>
    <div class="lg-title fl">
      <p class="title">{{title1}}</p>
      <p class="intro">{{intro}}</p>
      <div class="code">
        <img :src="imgs.code" alt="">
        <p><span>扫一扫关注官方微信</span><span>微信商城，购物更方便！</span></p>
      </div>
    </div>
    <div class="lg-box fl">
      <LgInput />
    </div>
  </div>
</template>
<script>
import LgInput from './input.vue'
export default {
  components: {LgInput},
  name: "",
  data() {
    return {
      title1:"风水网，求购更迅速",
      intro:"风水网，求购更快更好",
      imgs:{
        code:require('@/assets/imgs/login/code.jpg'),//二维码
      }
    };
  },
  methods: {},
  created() {}
};
</script>
<style lang="scss" scoped>
.lg-body {
  left: 50%;
  top: 50%;
  width: 1200px;
  height: 480px;
  // background-color: red;
  transform: translate(-50%,-50%);
  
  .lg-title{
    width: calc(100% - 450px);
    height: 100%;
    padding-top: 20px;

    p{
      font-size: 24px;
      color: #fff;
      text-indent: 10px;
    }
    p.title{
      font-size: 62px;
      line-height: 70px;
      margin-bottom: 5px;
    }
    .code{
      margin-top: 130px;
      padding: 20px 10px;
      width: 550px;
      display: flex;
      background-color: rgba(255, 255, 255, 0.11);
      
      p{
        span{
          display: block;
          font-size: 18px;
          margin-bottom: 10px;
        }
      }
      img{
        width: 100px;
        height: 100px;
        margin-right: 20px;
      }
    }
  }
  .lg-box{
    width: 450px;
    height: 100%;
  }
}
</style>